<template>
  <div class="easy-container flex">
    <div class="cell shrink-0" style="padding-top: 3px; padding-right: 0;">
      <el-image :src="uploadIcon(file.img)" class="s15" />
    </div>
    <div class="cell flex-1">
      <router-link
        :to="`/spaces/${file.space.id}/resources-docs/${file.id}`"
        class="hover-underline-box"
        style="overflow: hidden;"
      >
        <div>
          <span class="title f-normal link hover-underline">{{ file.title }}</span>
          <el-tag v-for="tag in file.tags" :key="tag" size="mini">{{ tag }}</el-tag>
        </div>
        <div v-if="file.content" class="line2 m-t-8" v-html="$va.plainText(file.content)"></div>
      </router-link>
      <router-link
        :to="`/spaces/${file.space.id}`"
        class="info-deep f-mini-plus hover-underline block m-t-8"
      >所属空间：{{ file.space.title }}</router-link>
    </div>
  </div>
</template>

<script>
import FileIconMixin from '@/utils/file-icon-mixin';

export default {
  name: 'component-docs-list-item',
  mixins: [FileIconMixin],
  props: {
    file: Object,
  },
};
</script>

<style></style>
